<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>活动管理</title>
    <#include "../../common/link.ftl">
    <link rel="stylesheet" type="text/css" href="/js/plugins/bootstrap-select/bootstrap-select.css"/>
    <script src="/js/plugins/bootstrap-select/bootstrap-select.js"></script>
    <script>
         $(function () {
             // 日期插件 createTime
             $('.input-daterange').datepicker({
                 language: "zh-CN",
                 autoclose: true,
                 todayHighlight: true,
                 clearBtn: true
             });

             // 社团
             $.get("/association/listAsso.do", {}, function (data) {
                 var html = '';
                 var depts = data.data;
                 $.each(depts, function (index, item) {
                     html += '<option value="' + item.id + '">'+item.username+'</option>'
                 })
                 $("#associationId").html(html);

                 $('#associationId').selectpicker('refresh'); //刷新组件
             });

             // 活动标题
             $.get("/activity/listAll.do", {}, function (data) {
                 var html = '';
                 var depts = data.data;
                 $.each(depts, function (index, item) {
                     html += '<option value="' + item.id + '">'+item.title+'</option>'
                 })
                 $("#activityId").html(html);
                 $('#activityId').selectpicker('refresh'); //刷新组件
             });

             // 新增/编辑按钮点击事件
             $(".btn_redirect").click(function () {
                 //清除模态框的数据
                 //数据复原
                 $("#myModalLabel2").html("报名记录新增");
                 $("#editForm2").clearForm(true);
                 $('#associationId').selectpicker('val', '');
                 $('#activityId').selectpicker('val', '');

                 var json = $(this).data("json");
                 console.log(json)
                 $("#editForm2 select[name='status']").val(-1);
                 if(json){ //json有数据代表是编辑
                     $("#myModalLabel2").html("报名记录编辑");
                     $("#editForm2 input[name='id']").val(json.id);
                     $("#editForm2 input[name='applicant']").val(json.applicant);
                     $("#editForm2 input[name='number']").val(json.number);
                     $("#editForm2 input[name='createTime']").val(json.createTime);
                     $("#editForm2 select[name='status']").val(json.status);
                     $("#editForm2 textarea[name='reason']").val(json.reason);

                     var associationId = json.associationId;
                     $('#associationId').selectpicker('val', associationId);  //插件回显有数组
                     $('#associationId').selectpicker('refresh');   //刷新

                     var activityId = json.activityId;
                     $('#activityId').selectpicker('val', activityId);  //插件回显有数组
                     $('#activityId').selectpicker('refresh');   //刷新
                 }

                 //打开模态框
                 $("#myModal2").modal('show');
             });

             // 保存: 新增/编辑
             $(".btn-submit2").click(function () {
                 $("#editForm2").ajaxSubmit(function (data) {
                     if(data.code == 200){
                         window.location.reload();
                     }else{
                         $.messager.alert("温馨提示", data.msg);
                     }
                 })
             });

             //全选/全不选
             $("#allCb").click(function () {
                 //获取当前复选框checked状态,设置到table中的所有复选框
                 $(".cb").prop('checked',$(this).prop('checked'))
             })

             //table中的复选框
             $(".cb").click(function () {
                 //获取table中已经勾选的复选框的数量 , 判断是否等于table中的所有复选框的数量
                 $("#allCb").prop('checked',$(".cb:checked").length == $(".cb").length)
             })

             //批量审核成功
             $(".btn_batchPass").click(function () {
                 //获取勾选的数据
                 //判断是否有选中,如果没有需要先提示选中
                 if($(".cb:checked").length == 0){
                     $.messager.alert("警告","请先选中数据!");
                     return;
                 }
                 //把选中的员工的id存到在ids
                 var cbs = $(".cb:checked");
                 var ids = [];
                 $.each(cbs,function (index, ele) {
                     ids.push($(ele).data('id'));
                 })
                 //如果有,提示确认框是否删除
                 $.messager.confirm("提示","是否全部审核报名成功?",function () {
                     $.post('/activityRecord/batchPass.do',{ids:ids},handlerMessage)
                 })
             })

             // 查看失败理由
             $(".reasonBtn").click(function () {
                 //数据复原
                 $("#editForm").clearForm(true);

                 var json = $(this).data('json');
                 if(json){
                     $("#editForm textarea[name='reason']").val(json.reason);
                 }
                 $("#inputSynModal").modal('show');
             })

             $(".btn_yesPass").click(function () {   // 审核通过
                 var hot = $(this).data("hot");
                 var id = $(this).data("id");
                 $.get("/activityRecord/passOne.do", {hot:hot, id:id}, function (data) {
                     if(data.code == 200){
                         window.location.reload();
                     }else{
                         $.messager.alert("温馨提示", data.msg);
                     }
                 })
             });

            $(".btn_noPass").click(function () { // 报名失败
                //数据复原
                $("#editForm1").clearForm(true);
                $("#editForm1 input").val('');

                var id = $(this).data('id');
                var json = $(this).data('json');
                if(json){
                    $("#editForm1 input[name='id']").val(id);
                    $("#editForm1 input[name='activityId']").val(json);
                    $("#editForm1 input[name='status']").val('2');
                }
                $("#myModal").modal('show');
            });

             // 保存
             $(".btn-submit").click(function () {
                 $("#editForm1").ajaxSubmit(function (data) {
                     if(data.code == 200){
                         window.location.reload();
                     }else{
                         $.messager.alert("温馨提示", data.msg);
                     }
                 })
             });

         })
    </script>
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">
    <#include "../../common/navbar.ftl">
    <!--菜单回显-->
    <#assign currentMenu="activityRecordAdmin"/>
    <#include "../../common/menu.ftl">
    <div class="content-wrapper">
        <section class="content-header">
            <h1>活动记录管理</h1>
        </section>
        <section class="content">
            <div class="box">
                <!--高级查询--->
                <div style="margin: 10px;">
                    <form class="form-inline" id="searchForm" action="/activityRecord/list.do" method="post">
                        <input type="hidden" name="currentPage" id="currentPage" value="1">
                        <div class="form-group">
                            <label for="keyword">关键字：</label>
                            <input type="text" class="form-control" id="keyword" name="keyword" value="${qo.keyword!}" placeholder="请输入活动标题/社团">
                        </div>
                        &nbsp;
                        <div class="form-group">
                            <label for="applyer">报名者：</label>
                            <input type="text" class="form-control" id="applyer" name="applyer" value="${qo.applyer!}" placeholder="请输入报名者姓名">
                        </div>
                        &nbsp;
                        <div class="form-group">
                            <label for="agreeStatus">状态：</label>
                            <select class="form-control" id="applyStatus" name="applyStatus">
                                <option value="-1">全部</option>
                                <option value="0">报名中</option>
                                <option value="1">报名成功</option>
                                <option value="2">报名失败</option>
                            </select>
                        </div>
                        &nbsp;
                        <button id="btn_query" class="btn btn-primary"><span class="glyphicon glyphicon-search"></span> 查询</button>
                        <a href="javascript:;" class="btn btn-success btn_redirect">
                            <span class="glyphicon glyphicon-plus"></span> 添加
                        </a>
                        <a href="JavaScript:;" class="btn btn-info btn_batchPass">
                            <span class="glyphicon glyphicon-leaf"></span> 批量审核成功
                        </a>
                    </form>
                </div>
                <table class="table table-hover table-bordered">
                    <thead>
                    <tr>
                        <th><input type="checkbox" id="allCb"></th>
                        <th>编号</th>
                        <th>主办方</th>
                        <th>活动标题</th>
                        <th>报名者</th>
                        <th>性别</th>
                        <th>学院</th>
                        <th>专业</th>
                        <th>班级</th>
                        <th>报名时间</th>
                        <th>活动总时长</th>
                        <th>本社团成员</th>
                        <th>状态</th>
                        <th>操作</th>
                        <th>报名失败原因</th>
                    </tr>
                    </thead>
                    <#list page.list as activityRecord>
                        <tr>
                            <td><input type="checkbox" class="cb" data-id="${activityRecord.id}"></td>
                            <td>${activityRecord_index+1}</td>
                            <td>${activityRecord.association!}</td>
                            <td>${activityRecord.activityName!}</td>
                            <td>${activityRecord.applicant!}</td>
                            <td>${activityRecord.sex!}</td>
                            <td>${activityRecord.academy!}</td>
                            <td>${activityRecord.major!}</td>
                            <td>${activityRecord.className!}</td>
                            <td>${(activityRecord.createTime?string('yyyy-MM-dd HH:mm:ss'))!}</td>
                            <td>${(activityRecord.allTime)!}</td>
                            <td>
                                ${(activityRecord.myclub)!}
                            </td>
                            <td>
                                <#if activityRecord.status == 0 >
                                    报名中
                                <#elseif activityRecord.status == 1>
                                    成功
                                <#elseif activityRecord.status == 2>
                                    失败
                                </#if >
                            </td>
                            <td>
                                <a href="javascript:;" class="btn btn-info btn-xs btn_redirect" data-json='${activityRecord.jsonString}'>
                                    <span class="glyphicon glyphicon-pencil"></span> 编辑
                                </a>
                                <a href="JavaScript:;" class="btn btn-success btn-xs btn_yesPass" data-hot='1' data-id="${activityRecord.id}">
                                    <span class="glyphicon glyphicon-star"></span> 审核成功
                                </a>
                                <a href="JavaScript:;" class="btn btn-danger btn-xs btn_noPass" data-json="${activityRecord.activityId!}" data-id="${activityRecord.id}">
                                    <span class="glyphicon glyphicon-star-empty"></span> 审核失败
                                </a>
                            </td>
                            <td>
                                <#if activityRecord.status == 2>
                                    <a class="btn btn-info btn-xs reasonBtn" href="JavaScript:;" data-json="${activityRecord.reason}">失败理由
                                    </a>
                                </#if>
                            </td>
                        </tr>
                    </#list>
                </table>
                <!--分页-->
                <#include "../../common/page.ftl">
            </div>
        </section>
    </div>
    <#include "../../common/footer.ftl">
</div>

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">报名审核</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" action="/activityRecord/refuseOne.do" method="post" id="editForm1">
                    <input hidden name="id">
                    <input hidden name="activityId">
                    <input hidden name="status">
                    <div class="form-group" style="margin-top: 10px;">
                        <label for="agreeRefuse" class="col-sm-3 control-label">拒绝报名理由：</label>
                        <div class="col-sm-6">
                            <textarea class="form-control" name="reason" id="reason"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary btn-submit">保存</button>
            </div>
        </div>
    </div>
</div>

<!-- Modal模态框 -->
<div class="modal fade" id="inputSynModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalSynLabel">失败理由</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" action="" method="post" id="editForm">
                    <div class="form-group">
                        <div class="col-sm-12">
                            <textarea rows="10" style="min-width: 100%" name="reason"></textarea>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

<!-- 新增/编辑 -->
<div class="modal fade" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel2">报名记录新增</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" action="/activityRecord/saveOrUpdate.do" method="post" id="editForm2">
                    <input type="hidden" name="id" >
                    <div class="form-group" style="margin-top: 10px;">
                        <label for="association" class="col-sm-3 control-label">社团名称：</label>
                        <div class="col-sm-6">
                            <select class="form-control selectpicker" id="associationId" name="associationId"  data-live-search="true" title="请选择关联的社团">

                            </select>
                        </div>
                    </div>
                    <div class="form-group" style="margin-top: 10px;">
                        <label for="activity" class="col-sm-3 control-label">活动名称：</label>
                        <div class="col-sm-6">
                            <select class="form-control selectpicker" id="activityId" name="activityId"  data-live-search="true" title="请选择关联的活动">
                            </select>
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="applicant" class="col-sm-3 control-label">报名者：</label>
                        <div class="col-sm-6">
                            <input type="text" class="form-control" id="applicant" name="applicant">
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="applicant" class="col-sm-3 control-label">学号：</label>
                        <div class="col-sm-6">
                            <input type="text" class="form-control" id="number" name="number">
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="createTime" class="col-sm-3 control-label">报名时间：</label>
                        <div class="col-sm-6 input-daterange" id="datepicker">
                            <input type="text" class="input-sm form-control wicon" name="createTime" id="createTime"/>
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="allTime" class="col-sm-3 control-label">报名状态：</label>
                        <div class="col-sm-6">
                            <select class="form-control" id="status" name="status">
                                <option value="-1">全部</option>
                                <option value="0">报名中</option>
                                <option value="1">报名成功</option>
                                <option value="2">报名失败</option>
                            </select>
                        </div>
                    </div>

                    <div class="form-group">
                        <label for="allTime" class="col-sm-3 control-label">报名失败理由：</label>
                        <div class="col-sm-6">
                            <textarea type="text" class="form-control" id="reason" name="reason">
                            </textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                <button type="button" class="btn btn-primary btn-submit2">保存</button>
            </div>
        </div>
    </div>
</div>

</body>
</html>
